import {ComponentType} from 'react';
// https://loadable-components.com
import loadable from '@loadable/component'

const lazyComponent = (fileName: string) => loadable(() => import(`@/views/${fileName}`));

// React.StrictMode 严格模式不能 这种懒加载
// import Loadable from 'react-loadable';
// import Loading from "./components/loading";
// https://github.com/jamiebuilds/react-loadable
// import Loadable from 'react-loadable';
// const lazyComponent = (fileName: string) => Loadable({
//     loader: () => import(`@/views/${fileName}.tsx`),
//     loading: Loading,
// });

export interface RouteConfig {
    path: string;
    exact?: boolean;
    component: ComponentType
}


const routers: Array<RouteConfig> = [
    {
        path: '/',
        exact: true,
        component: lazyComponent('home')
    },
    {
        path: '/about',
        exact: true,
        component: lazyComponent('about')
    },
    {
        path: '/threejs/hello-world',
        exact: true,
        component: lazyComponent('threejs/hello-world')
    },
    {
        path: '/threejs/draw-line',
        exact: true,
        component: lazyComponent('threejs/draw-line')
    }
];

export default routers;
